<!DOCTYPE html>
<html class="x-admin-sm" xmlns:th="http://www.thymeleaf.org">

<!--1、Head：标题、css-->
<head th:replace="admin_fragments :: head(个人信息)">
    <meta charset="UTF-8">
    <title>个人信息</title>
</head>
<!--2、JS-->
<div th:replace="admin_fragments :: script"></div>

<!--3、内容-->
<body style="margin:50px 0 auto">
<div class="m-box">
    <form class="layui-form" action="" id="changefileform" style="margin-top: 30px">

        <!--1、头像-->
        <div class="layui-form-item">
            <div class="layui-inline">
                <div class="layui-input-inline m-avatar-box">
                    <img class="m-avatar" th:src="@{/img/logo.png} "/>
                </div>
            </div>
        </div>

        <!--3、用户名-->
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">用户名</label>
                <div class="layui-input-inline">
                    <input type="text" name="username" th:value="${user.userName}" autocomplete="off"
                           class="layui-input" readonly>
                </div>
            </div>
        </div>

        <!--4、密码-->
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">密码</label>
                <div class="layui-input-inline">
                    <input type="text" name="password" th:value="${user.userPassword}" autocomplete="off"
                           class="layui-input" readonly>
                </div>
            </div>
        </div>

        <!--5、邮箱-->
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">邮箱</label>
                <div class="layui-input-inline">
                    <input type="text" name="email" th:value="${user.userEmail}" autocomplete="off"
                           class="layui-input" readonly>
                </div>
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">年龄</label>
                <div class="layui-input-inline">
                    <input type="text" name="email" th:value="${user.userAge}" autocomplete="off"
                           class="layui-input" readonly>
                </div>
            </div>
        </div>

        <!--6、创建时间-->
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">创建时间</label>
                <div class="layui-input-inline">
                    <input type="text" name="createTime"
                           th:value="${#dates.format(user.createTime,'yyyy-MM-dd HH:mm:ss')}" autocomplete="off"
                           class="layui-input" readonly>
                </div>
            </div>
        </div>

        <!--7、角色类型-->
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">角色类型</label>
                <div class="layui-input-inline">
                    <input type="text" name="type" th:value="${user.type == 1 ? '管理员' : '用户'}"
                           autocomplete="off"
                           class="layui-input" readonly>
                </div>
            </div>
        </div>

    </form>

</div>

</body>
<style>
    .m-box {
        display: flex;
        margin-left: 300px;

    }

    .m-avatar {
        margin-left: 150px;
        margin-bottom: 20px;
        height: 100px;
        width: 100px;
        border-radius: 100px;
    }

</style>
</html>